<div id="centered">

    <!--This is the clock-->
    <div id="html5-clock" ></div>
    <!--end clock-->

</div>

<!--Configure your clock-->
<script type="text/javascript">
    var config = {

        /*the name of the div containing the clock*/
        divId: "html5-clock",

        /*set to false if you don't want to use the second hand*/
        useSecondHand: "true",

        /*width and height of the clock*/
        clockWidthAndHeight: "200",

        /*location of the images*/
        clockFaceImg: "/images/clock/clockBg.png",
        hourHandImg: "/images/clock/hourHand.png",
        minuteHandImg: "/images/clock/minuteHand.png",
        secondHandImg: "/images/clock/secondHand.png",
        /*location of the high res images for retina display*/
        clockFaceHighResImg: "/images/clock/clockBgHighRes.png",
        hourHandHighResImg: "/images/clock/hourHandHighRes.png",
        minuteHandHighResImg: "/images/clock/minuteHandHighRes.png",
        secondHandHighResImg: "/images/clock/secondHandHighRes.png",

        /*Set true to make hand move at steady speed*/
        smoothRotation: "false",

        /*speed of the second hand. Lower is faster. */
        /*Must be under 1000. */
        /*If smooth rotation is true, this does nothing.*/
        secondHandSpeed: "100"

    };

    var myhtml5Clock = new html5Clock(config);

</script>